<div class="sql">
  <div>
    <com-title [comTitle]="naviTitle"></com-title>
  </div>
  <div class="sql-body">
       <div class="sql-navi">
          <nz-breadcrumb style="margin-top:5px">
              <nz-breadcrumb-item>
                数据源列表
              </nz-breadcrumb-item>
              <nz-breadcrumb-item>
                <a (click)="goback()">返回上一级</a>
              </nz-breadcrumb-item>
              <nz-breadcrumb-item>
                数据源信息
              </nz-breadcrumb-item>
            </nz-breadcrumb>
          <div>
            <nz-input [nzType]="'search'" [nzPlaceHolder]="'输入表或试图名称'" style="width: 200px;" ></nz-input>
          </div>
       </div>
       <div class="sql-table">
          <nz-tabset>
              <nz-tab *ngFor="let tab of tabs">
                <ng-template #nzTabHeading style="margin-bottom:6px">
                  {{tab.name}}
                </ng-template>
                <div [ngSwitch]="tab.page">
                    <div *ngSwitchCase="1">
                      <com-table [dbTables]="tables"></com-table>
                    </div>
                    <div *ngSwitchCase="2">
                      <com-custom [dataSourceId]="datasourceId"></com-custom>
                    </div>
                    <div *ngSwitchCase="3">
                        <com-basic [dbMsg]="dbSourceMsg"></com-basic>
                      </div>
                </div>
              </nz-tab>
            </nz-tabset>
       </div>
  </div>
</div>